(function () {
    var LPB = window.LPB = window.LPB || {
        plugins: [],
        genSource: function () {
            var $temptxt = $("<div>").html($("#build").html());
            //scrubbbbbbb
            $($temptxt).find(".component").attr({
                "title": null,
                "data-original-title": null,
                "data-type": null,
                "data-content": null,
                "rel": null,
                "trigger": null,
                "style": null
            });
            $($temptxt).find(".valtype").attr("data-valtype", null).removeClass("valtype");
            $($temptxt).find(".component").removeClass("component");
            $($temptxt).find("form").attr({
                "id": null,
                "style": null
            });
            $("#source").val($temptxt.html().replace(/\n\ \ \ \ \ \ \ \ \ \ \ \ /g, "\n"));
        }

    };
    /* 表单名称控件 form_name
    acc  是 class="component" 的DIV 
    e 是 class="leipiplugins" 的控件
    */
    LPB.plugins['form_name'] = function (active_component, leipiplugins) {
        var plugins = 'form_name',
            popover = $(".popover");
        //右弹form  初始化值
        $(popover).find("#orgvalue").val($(leipiplugins).val());
        //右弹form  取消控件
        $(popover).delegate(".btn-danger", "click", function (e) {
            e.preventDefault();
            active_component.popover("hide");
        });
        //右弹form  确定控件
        $(popover).delegate(".btn-info", "click", function (e) {
            e.preventDefault(); //阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交
            var inputs = $(popover).find("input");
            $.each(inputs, function (i, e) {
                var attr_name = $(e).attr("id"); //属性名称
                var attr_val = $("#" + attr_name).val();
                if (attr_name == 'orgvalue') {
                    $(leipiplugins).attr("value", attr_val);
                    active_component.find(".leipiplugins-orgvalue").text(attr_val);
                }
                active_component.popover("hide");
                LPB.genSource(); //重置源代码
            });
        });
    };
})();

$(document).ready(function () {
    $("#navtab").delegate("#sourcetab", "click", function (e) {
        LPB.genSource();
    });
    $("form").delegate(".component", "mousedown", function (md) {
        ///$(this).css('cursor', 'move');
        //$(".popover").remove();
        md.preventDefault();
        var tops = [];
        var mouseX = md.pageX;
        var mouseY = md.pageY;
        var $temp;
        var timeout;
        var $this = $(this);
        var delays = {
            main: 0,
            form: 120
        }
        var type;

        if ($this.parent().parent().parent().parent().attr("id") === "components") {
            type = "main";
        } else {
            type = "form";
        }

        var delayed = setTimeout(function () {
            if (type === "main") {
                $temp = $("<form class='form-horizontal span6' id='temp'></form>").append($this.clone());
            } else {
                if ($this.attr("id") !== "legend") {
                    //判断有没有重复添加         
                    var targetarr = [];
                    if ($this.parent().parent().parent()[0].id != "build") {
                        var targetobj = $("#target").children().children();
                        //var targetarr = [];
                        for (var i = 0; i < targetobj.length; i++) {
                            targetarr.push(targetobj[i].children[0].children[0].placeholder);
                        }
                    }

                    if (targetarr.indexOf($this.children().children()[0].placeholder) <= -1) { //判断当前元素是否存在于已经添加的元素中，没有就添加，有就return
                        //判断这个元素是在哪个框，在左边就加克隆，在右边就不加克隆(下面4行判断很重要)，
                        if ($this.parent().parent().parent()[0].id == "build")
                            $temp = $("<form class='form-horizontal span6' id='temp'></form>").append($this);
                        else
                            $temp = $("<form class='form-horizontal span6' id='temp'></form>").append($this.clone());
                    } else
                        return;
                }
            }

            $("body").append($temp);
            console.log(mouseX, mouseY);
            //   console.log($temp);

            $temp.find('input').css({
                cursor: 'move',
                // 'background-color': '#FF8C69',
            });
            $temp.css({
                "position": "absolute",
                "top": mouseY - ($temp.height() / 2) + "px",
                "left": mouseX - ($temp.width() / 2) + "px",
            }).show();


            var half_box_height = ($temp.height() / 2);
            var half_box_width = ($temp.width() / 2);
            var $target = $("#target");
            var tar_pos = $target.position();
            var $target_component = $("#target .component");

            $(document).delegate("body", "mousemove", function (mm) {

                var mm_mouseX = mm.pageX;
                var mm_mouseY = mm.pageY;

                $temp.css({
                    "top": mm_mouseY - half_box_height + "px",
                    "left": mm_mouseX - half_box_width + "px"
                });

                if (mm_mouseX > tar_pos.left &&
                    mm_mouseX < tar_pos.left + $target.width() + $temp.width() / 2 &&
                    mm_mouseY > tar_pos.top &&
                    mm_mouseY < tar_pos.top + $target.height() + $temp.height() / 2
                ) {
                    $("#target").css("background-color", "#2d3041");
                    $target_component.css({
                        "border-top": "0px solid white",
                        "border-bottom": "none"
                    });
                    tops = $.grep($target_component, function (e) {
                        return ($(e).position().top - mm_mouseY + half_box_height > 0 && $(e).attr("id") !== "legend");
                    });
                    if (tops.length > 0) {
                        $(tops[0]).css("border-top", "0px solid #22aaff");
                    } else {
                        if ($target_component.length > 0) {
                            $($target_component[$target_component.length - 1]).css("border-bottom", "0px solid #22aaff");
                        }
                    }
                } else {
                    $("#target").css("background-color", "#2d3041");
                    $target_component.css({
                        "border-top": "0px solid white",
                        "border-bottom": "none"
                    });
                    $target.css("background-color", "#2d3041");
                }
            });

            $("body").delegate("#temp", "mouseup", function (mu) {
                $(this).css('cursor', 'move');
                mu.preventDefault();

                var mu_mouseX = mu.pageX;
                var mu_mouseY = mu.pageY;
                var tar_pos = $target.position();

                $("#target .component").css({
                    "border-top": "0px solid white",
                    "border-bottom": "none",
                    "float": "left"
                });

                // acting only if mouse is in right place
                if (mu_mouseX + half_box_width > tar_pos.left &&
                    mu_mouseX - half_box_width < tar_pos.left + $target.width() &&
                    mu_mouseY + half_box_height > tar_pos.top &&
                    mu_mouseY - half_box_height < tar_pos.top + $target.height()
                ) {
                    $temp.find('input').css({
                        cursor: 'default',
                        'background-color': '#0094ff',
                    });
                    $temp.attr("style", null);
                    // where to add
                    if (tops.length > 0) {
                        $($temp.html()).insertBefore(tops[0]);
                    } else {
                        $("#target fieldset").append($temp.append("\n\n\ \ \ \ ").html());
                    }
                    //这是自己写的方法，表格拖拽后，初始化显示字段
                    addField($this);
                } else {
                    // no add
                    $("#target .component").css({
                        "border-top": "0px solid white",
                        "border-bottom": "none"
                    });
                    tops = [];
                    removeField($this);
                }
                // 更新确定表单按钮
                // if ($('#tableBody2 tr').length > 1) {
                //     $('.getDataTable').removeClass('disabled');
                // } else {
                //     $('.getDataTable').addClass('disabled');
                // }
                if ($('#target .component').length > 1) {
                    $('.getDataTable').removeClass('disabled');
                } else {
                    $('.getDataTable').addClass('disabled');
                }
                $('#show').hide();


                //clean up & add popover
                $target.css("background-color", "#2d3041");
                $(document).undelegate("body", "mousemove");
                $("body").undelegate("#temp", "mouseup");
                $("#target .component").popover({
                    trigger: "manual"
                });
                $temp.remove();
                LPB.genSource();
            });
        }, delays[type]);

        $(document).mouseup(function () {
            clearInterval(delayed);
            return false;
        });
        $(this).mouseout(function () {
            clearInterval(delayed);
            return false;
        });
    });

    //activate legend popover
    $("#target .component").popover({
        trigger: "manual"
    });
    //popover on click event
    $("#target").delegate(".component", "click", function (e) {
        e.preventDefault();
        //$(".popover").hide();
        var active_component = $(this);
        active_component.popover("show");
        //class="leipiplugins"
        var leipiplugins = active_component.find(".leipiplugins"),
            plugins = $(leipiplugins).attr("leipiplugins"); //leipiplugins="text"
        //exec plugins
        if (typeof (LPB.plugins[plugins]) == 'function') {
            try {
                LPB.plugins[plugins](active_component, leipiplugins);
            } catch (e) {
                alert('控件异常！');
            }
        } else {
            alert("控件有误或不存在！");
        }

    });
});